import React, { useState } from 'react'
import { InfiniteScroll, List } from 'antd-mobile'
// import style from 'index.module.css'
function Index() {
    const [list,setList]=useState([
        {
            name:'都市之最强狂兵',
            data:'2023-01-01',
            id:'1'
        },
        {
            name:'国之重器',
            data:'2023-01-02',
            id:'2'
        },
        {
            name:'都市黄蓝',
            data:'2023-01-03',
            id:'3'
        },
        {
            name:'生意绝世',
            data:'2023-01-04',
            id:'4'
        },
        {
            name:'嘻嘻嘻',
            data:'2023-01-05',
            id:'5'
        },
        {
            name:'青春',
            data:'2023-01-05',
            id:'5'
        }
    ])
  const [hasMore, setHasMore] = useState(true)
  async function loadMore() {
      setHasMore(true)
      setList((aa)=>{
        return [...aa,{
             name:'绝世容颜',
            data:Date.now(),
            id:Date.now()
        }]
      })
  }
  return (
    <div>
   
    {
        list.map((item)=>{
            return <div key={item.id} style={{height:'150px'}}>{item.name}</div>
        })
    }
     <InfiniteScroll loadMore={loadMore} hasMore={hasMore} />
    </div>
  )
}

export default Index
